{# 控件库 #}

{#
    控件禁用 : disabled
#}

{% macro xuhao(item) %}
{{ (app.request.get('page', 1) - 1) * app.request.get('rows', 15) + item + 1 }}
{% endmacro %}

{% macro label(text, other, is_required) %}
    <label class="control-label" {{ other | raw }}>{% if is_required | default(0) == 1 %}<span style="color: red">*</span>{% endif %}{{ text }}</label>
{% endmacro %}

{% macro subject_info(array) %}
    ({{ array.subject_type_str }}){{ array.subject_name }}/{{ array.subject_sign }}
{% endmacro %}

{% macro text(value, placeholder, type, class, other, help) %}
    <div class="controls">
        <input
                type="{{ type | default('text') }}"
                placeholder="{{ placeholder }}"
                value="{{ value }}"
                class="{{ class | default('input-prepend') }}"
                {{ other | raw}}
        >
        {% if help is not empty %}
        <span class="help-inline">{{ help | raw }}</span>
        {% endif %}
    </div>
{% endmacro %}

{#
     统计控件
#}
{% macro statistics(title, numbers, value, tag, class, other , href , parameter) %}
<div data-desktop="span2" data-tablet="span4" onclick="go_url('{{ href | default('#') }}{{ parameter | default('#') }}') " class="span2 responsive responsive-href {{ class }}" style="margin-left: 10px; margin-right: 10px;" data-tag="{{ tag }}" {{ other | raw }}>
    <div class="metro-overview turquoise-color clearfix" {% if value == tag and tag is not null %}style="background-color: #E57C18" {% endif %}>
        <div class="details">
            <div class="numbers" style="text-align: center">{{ numbers }}</div>
            <div class="title" style="text-align: center">{{ title }}</div>
        </div>
    </div>
</div>
{% endmacro %}

{#
    自定义按钮
    class填写btn为按钮样式
#}
{% macro button(text, type, class, other) %}
    <button
            type="{{ type | default('button') }}"
            class="{{ class | default('a-click') }}"
            {{ other | raw }}
    >{{ text | raw }}</button>

{% endmacro %}

{#编辑按钮#}
{% macro buttonEdit(text, other, class) %}
    <button type="button" class="btn btn-info btn-update {{ class | default }}" {{ other | raw }}>{{ text | raw }}</button>

{% endmacro %}

{#重置按钮#}
{% macro buttonReset(text, other, class) %}
    <button type="button" class="btn btn-warning btn-reset {{ class | default }}" {{ other | raw }}>{{ text | raw }}</button>

{% endmacro %}

{#删除按钮#}
{% macro buttonDelete(text, other, class) %}
    <button type="button" class="btn btn-danger btn-delete {{ class | default }}" {{ other | raw }}>{{ text | raw }}</button>

{% endmacro %}

{#默认按钮#}
{% macro buttonDefault(text, other, class) %}
    <button type="button" class="btn btn-primary {{ class | default }}" {{ other | raw }}>{{ text | raw }}</button>

{% endmacro %}

{#完成按钮#}
{% macro buttonSuccess(text, other, class) %}
    <button type="button" class="btn btn-success {{ class | default }}" {{ other | raw }}>{{ text | raw }}</button>

{% endmacro %}

{#反色按钮#}
{% macro buttonInverse(text, other, class) %}
    <button type="button" class="btn btn-inverse {{ class | default }}" {{ other | raw }}>{{ text | raw }}</button>

{% endmacro %}

{% macro a(text, type, class, other) %}
    <a
            type="{{ type | default('button') }}"
            class="{{ class | default('a-click') }}"
            {{ other | raw }}
    >{{ text | raw }}</a>

{% endmacro %}


{% macro textarea(value, placeholder, class, rows, other) %}
    <div class="controls">
        <textarea class="{{ class | default('span6') }} textarea" rows="{{ rows | default(3) }}" placeholder="{{ placeholder }}"  {{ other | raw }}>{{ value | raw }}</textarea>
    </div>
{% endmacro %}

{% macro uploadImage(value, other, help, uploadName, width, height) %}

    {% set uploadName = uploadName | default('uploadImage') %}
    {% set button_id = uploadName ~ '_b' %}
    {% set img_div_id = uploadName ~ '_i' %}
    {% set width = width | default(0) %}
    {% set height = height | default(0) %}

    <div class="controls">
        <div style="display:inline-block;padding-top: 20px;">
            <img style="max-height: 200px;min-height: 100px;box-shadow: 0 0 30px #eee;" src="{{ value | default(asset('bundles/admin/img/uploadImage.png'))}}" id = "{{ img_div_id }}">
        </div>

        {% if help | default('') != '' %}
        <div style="display: inline-block;vertical-align: bottom"><i class="layui-icon" style="color: #F0AD4E;">&#xe607;</i><span>{{ help }}</span></div>
        {% endif %}

        <button type="button" style="display: block;margin-top: 10px;" class="layui-btn" id="{{ button_id }}">
            <i class="layui-icon">&#xe67c;</i>上传图片
        </button>


        <input type="hidden" id="{{ uploadName }}" {{ other | raw }}>
    </div>

    <script>
        layui.use('upload', function(){
            var upload = layui.upload;
            var url = "{{ path('service_resource_upload') }}";
            var uploadName = "{{ uploadName }}";
            var width = "{{ width }}";
            var height = "{{ height }}";

            //执行实例
            var uploadInst = upload.render({
                elem: '#{{ button_id }}' //绑定元素
                ,url: url //上传接口
                ,data : {file_type : 0 , input_name : uploadName, width: width, height: height}
                ,field : uploadName
                ,done: function(result){
                    //请求成功回调
                    console.log(result);
                    resultPreprocess(result, undefined, function (result) {
                        $('#{{ img_div_id }}').attr('src', result.data.server_path);
                        $('#{{ uploadName }}').val(result.data.path_name);

                    });
                }
                ,error: function(){
                    //请求异常回调
                    windowsMessage('服务器异常');
                }
            });

        });
    </script>
{% endmacro %}


{% macro multiImageUpload(value, utterField , relativelyField, other, help, uploadName, width, height, maxNum) %}

    {% set uploadName = uploadName | default('multiImageUpload') %}
    {% set button_id = uploadName ~ '_b' %}
    {% set img_div_id = uploadName ~ '_i' %}
    {% set width = width | default(0) %}
    {% set height = height | default(0) %}
    {% set multiImageUploadRemove_class = uploadName ~ '_multiImageUploadRemove' %}
    <style>
        #{{ img_div_id }}>div:hover .img_hover{display:block!important;}
    </style>


    <div class="controls" style="margin-top: 50px">
        <div id="{{ img_div_id }}" style="width: 800px;">
            {% if value is not empty %}
                {% for key in value %}
                    <div style="width: 220px; height:160px;float: left; margin-right: 5px; margin-bottom:5px; position: relative;  ">
                        <img style="width: 100%;height:100%" src="{{ key[utterField] }}">
                        <div class="img_hover" style="width: 100%;height:100%;background:rgba(0,0,0,0.4);position:absolute;top:0;left:0;display: none;">
                            <button data-url="{{ key[relativelyField] }}" type="button" class="layui-btn {{ multiImageUploadRemove_class }}" style="width:40%;height:38px;border:0;background-color: #009688;margin-top:77px;margin-left:30%;border-radius: 25px;color:#fff;font-size: 14px;">删&nbsp;&nbsp;除</button>
                        </div>
                    </div>
                {% endfor %}
            {% endif %}
        </div>

        <button type="button" style="display: block;margin-top: 10px; clear: both;" class="layui-btn" id="{{ button_id }}">
            <i class="layui-icon">&#xe67c;</i>上传图片
        </button>

        {% if help | default('') != '' %}
            <div style="display: inline-block;vertical-align: bottom"><i class="layui-icon" style="color: #F0AD4E;">&#xe607;</i><span>最大允许上传{{ maxNum | default(5) }}张 {{ help }}</span></div>
        {% endif %}

        <input type="hidden" id="{{ uploadName }}" {{ other | raw }}>
    </div>

    <script>
        var max_num = 0;
        var init_length = {{ value|length }}
        layui.use('upload', function(){
            var upload = layui.upload;
            var url = "{{ path('service_resource_upload') }}";
            var uploadName = "{{ uploadName }}";
            var width = "{{ width }}";
            var height = "{{ height }}";

            //执行实例
            var uploadInst = upload.render({
                elem: '#{{ button_id }}' //绑定元素
                ,url: url //上传接口
                ,data : {file_type : 0 , input_name : uploadName, width: width, height: height}
                ,field : uploadName
                ,done: function(result){
                    //请求成功回调
                    console.log(result);
                    resultPreprocess(result, undefined, function (result) {
                        $('#{{ img_div_id }}').append(
                            '<div style="width: 220px; height:160px;float: left; margin-right: 5px; margin-bottom:5px; position: relative;  ">\n' +
                            '                        <img style="width: 100%;height:100%" src="' + result.data.server_path + '" class="img_back">\n' +
                            '                        <div class="img_hover" style="width: 100%;height:100%;background:rgba(0,0,0,0.4);position:absolute;top:0;left:0;display: none;">\n' +
                            '                            <button data-url="' + result.data.path_name + '"type="button" class="layui-btn {{ multiImageUploadRemove_class }}" style="width:40%;height:38px;border:0;background-color: #009688;margin-top:77px;margin-left:30%;border-radius: 25px;color:#fff;font-size: 14px;">删&nbsp;&nbsp;除</button>\n' +
                            '                        </div>\n' +
                            '                     </div>'
                        );
                        var value = $('#{{ uploadName }}').val();
                        if(value == ''){
                            value = result.data.path_name;
                        }else{
                            value += ',' + result.data.path_name;
                        }
                        $('#{{ uploadName }}').val(value);
                        max_num ++;
                        if(max_num == {{ maxNum | default(5) }}-init_length){
                            $('#{{ button_id }}').attr("disabled", true);
                        }
                    });
                }
                ,error: function(){
                    //请求异常回调
                    windowsMessage('服务器异常');
                }
            });

            //移除图片
            $('.{{ multiImageUploadRemove_class }}').live('click', function () {
                {#var value = $('#{{ uploadName }}').val().replace($(this).data('url') + ',', '');#}
                {#var value = value.replace($(this).data('url'), '');#}
                var value_arr = $('#{{ uploadName }}').val().split(',');
                var click_value = $(this).data('url');
                $.each(value_arr,function (index,value) {
                    if(new RegExp(value).test(click_value) || click_value == value){
                        value_arr.splice(index, 1);
                        return false;
                    }
                });
                var value = value_arr.join(',');

                $('#{{ uploadName }}').val(value);
                $(this).parent().parent().remove();
                max_num --;
                $('#{{ button_id }}').attr("disabled", false);
            });
        });
    </script>

{% endmacro %}


{% macro dateTime(value, placeholder, other, type, id) %}
    {% set id =  id | default('dateTime1')  %}
    <div class="controls">
        <input type="text" id="{{ id }}"  placeholder="{{ placeholder }}" {{ other | raw }}>
    </div>
    <script>
        layui.use('laydate', function(){
            var laydate = layui.laydate;
            var pot = [];
            pot['elem'] = '#{{ id }}';
            pot['type'] = '{{ type | default('date') }}';
            if("{{ value | default('') }}" !== ''){
                pot['value'] = "{{ value }}";
            }

            //执行一个laydate实例
            laydate.render(pot);
        });
    </script>
{% endmacro %}

{#
    opt:
        参考地址 http://fexteam.gz01.bdysite.com/ueditor/#start-config  | 配置config
               http://fexteam.gz01.bdysite.com/ueditor/#api-common    |  常用API
        readonly :  [默认值：false] //编辑器初始化结束后，编辑区域是否是只读的，默认是false

        其他常用功能  获取编辑器html内容  ue.getContent();
        其他常用功能  清空内容  ue.execCommand();
#}
{% macro ueditor(value, other, Width, Height, opt, id) %}
    {% set id = id | default('ude') %}
    {% set div_id = id ~ 'div' %}
    {% set Width = Width | default(800) %}
    {% set Height = Height | default(600) %}
    <div class="controls" id="{{ div_id }}">
        <script id="{{ id }}"  type="text/plain" {{ other | raw }} style="width: 100%; max-width: {{ Width }}px;">{{ value | raw}}</script>
    </div>
    <script>
        var config = {
            initialFrameHeight: {{ Height }},
            allowDivTransToP: false,
            topOffset: 60
        };

        {% if opt is not empty %}
            {% for item , val in opt %}
                config["{{ item }}"] = {{ val }};
            {% endfor %}
        {% endif %}

        var {{ id }} =  UE.getEditor('{{ id }}', config);
        
    </script>
{% endmacro %}



  {#
        在外部设置html的变量  html代码

        other:   其他需要增添的一些属性

        first_value:默认第一项的value
        fiest_text:默认第一项显示的值

        value_name:二维数组   value属性的值
        text_name：二维数组    显示的值
  #}
{% macro htmlSelect(html, other) %}
    <div class="controls">
        <select class="input-large m-wrap" {{ other | raw }} style="width: 220px;">
                {{ html | raw }}
        </select>
    </div>
{% endmacro %}

{% macro select(value, data, other, first_value, first_text, value_name, text_name) %}
    <div class="controls">
        <select class="input-large m-wrap" {{ other | raw }} style="width: 220px;">
            {% if first_text != '' %}
                <option value='{{ first_value }}'>{{ first_text }}</option>
            {% endif %}
            {% if value_name == '' and text_name == '' %}
                {% for item,val in data %}
                    <option value='{{ item }}' {% if value == item and value !='' %} selected {% endif %} >{{ val }}</option>
                {% endfor %}
            {% else %}
                {% for item,val in data %}
                    <option value='{{ val[value_name] }}' {% if value ==  val[value_name] and value !='' %} selected {% endif %} >{{ val[text_name] }}</option>
                {% endfor %}
            {% endif %}
        </select>
    </div>
{% endmacro %}


{% macro htmlSearchSelect(html, other) %}
    <div class="controls">
        <select class="span6 chosen" {{ other | raw }} style="width: 220px;">
                {{ html | raw }}
        </select>
    </div>
{% endmacro %}

{% macro searchSelect(value, data, other, first_value, first_text, value_name, text_name) %}
    <div class="controls">
        <select class="span6 chosen" {{ other | raw }} style="width: 220px;" data-placeholder="{{ first_text }}">
            {% if first_text != '' %}
                <option value='{{ first_value }}'>{{ first_text }}</option>
            {% endif %}
            {% if value_name == '' and text_name == '' %}
                {% for item,val in data %}
                    <option value='{{ item }}' {% if value == item and value !='' %} selected {% endif %} >{{ val }}</option>
                {% endfor %}
            {% else %}
                {% for item,val in data %}
                    <option value='{{ val[value_name] }}' {% if value ==  val[value_name] and value != '' %} selected {% endif %} >{{ val[text_name] }}</option>
                {% endfor %}
            {% endif %}
        </select>
    </div>
{% endmacro %}


{% macro htmlRadio(html, other) %}
    <div class="controls" {{ other | raw }}>
        {{ html | raw }}
    </div>
{% endmacro %}

{#
    class为空是横向排列，为line是竖向排列
    其他属性和上面selecte控件类似
#}
{% macro radio(value, data, name, value_name, text_name, class, other) %}
    <div class="controls">
        {% if value_name == '' and text_name == '' %}
            {% for item,val in data %}
                <label class="radio {{ class }}">
                    <input type="radio" name="{{ name }}" value="{{ item }}" {% if value == item and value != '' %} checked {% endif %} />
                    {{ val }}
                </label>
            {% endfor %}
        {% else %}
            {% for item,val in data %}
                <label class="radio {{ class }}">
                    <input type="radio" name="{{ name }}" value="{{ val[value_name] }}" {% if value == item and value != '' %} checked {% endif %} />
                    {{ val[text_name] }}
                </label>
            {% endfor %}
        {% endif %}
    </div>
{% endmacro %}

{#
    自定义radio
    参数说明：
        value: input的value值
        show_val: 显示在外面的值
        name: input的name值
        id: input的id值
        default_checked: 默认选中填字符串'true',填其他或不填不默认选中
        checked_one和checked_two: 回显的时候填，当两个值都不为空且相等时，默认被选中
        class: input的class值
        other: 其他input属性
        lt_rt: 按钮显示在文字的左边还是右边，默认右边 填字符串  'left'   'right'

#}
{% macro radioDIY(value, show_val, name, id, default_checked, checked_one, checked_two, class, other, lt_rt) %}
    {% if lt_rt == 'left' or lt_rt == '' %}
    <label for="{{ id }}" style="display: inline-block;margin-bottom: 0;line-height: 30px;">{{ show_val }}</label>
    {% endif %}

    <input
            type="radio"
            name="{{ name }}"
            value="{{ value }}"
            class="{{ class }}"
            id="{{ id }}"
            style="position: absolute;top: -4px;right: 0;"
            {% if checked_one != '' and checked_two != '' and checked_one == checked_two %}
             checked
            {% elseif default_checked == 'true' %}
             checked
            {% endif %}
            {{ other }}
    />

    {% if lt_rt == 'right' %}
    <label for="{{ id }}" style="display: inline-block;margin-bottom: 0;line-height: 30px;">{{ show_val }}</label>
    {% endif %}

{% endmacro %}

{% macro htmlCheckOut(html, other) %}
    <div class="controls" {{ other | raw }}>
        {{ html | raw }}
    </div>
{% endmacro %}

{% macro checkBox(value, data, other, value_name, text_name, class) %}
    <div class="controls">
         {% if value_name == '' and text_name == '' %}
            {% for item,val in data %}
                <label class="checkbox {{ class }}">
                    <input type="checkbox" value="{{ item }}" />
                    {{ val }}
                </label>
            {% endfor %}
        {% else %}
            {% for item,val in data %}
                <label class="checkbox {{ class }}">
                    <input type="checkbox" value="{{ val[value_name] }}" />
                    {{ val[text_name] }}
                </label>
            {% endfor %}
        {% endif %}
      </div>
{% endmacro %}

{% macro image(path,other) %}
    <div class="controls">
            <img style="max-height: 50px;min-height: 50px;" {{ other | raw }} src="{{ path | default(asset('bundles/admin/img/uploadImage.png')) }}">
    </div>
{% endmacro %}

{#
    省市区联动框参数说明:
    id:外层标签的id，默认area
    province_name:省份的name属性
    city_name:市份的name属性
    county_name:县/区的name属性
    details_name:地区详情的name属性
    province_id:默认选中是的省份id
    city_id:默认选中是的市份id
    county_id:默认选中是的县/区id
    details_val:地区详情的默认值
#}
{% macro area(id,province_name, city_name, county_name,details_name, province_id, city_id, county_id, details_val) %}
    <div class="controls " id="{{ id | default('area') }}">
        <select class="input-large m-wrap province" name="{{ province_name|default('') }}"  style="width: 220px;">
            <option value="">请选择省</option>
        </select>
        <select class="input-large m-wrap city" name="{{ city_name|default('') }}" style="width: 220px;">
            <option value="">请选择市</option>
        </select>
        <select class="input-large m-wrap county" name="{{ county_name|default('') }}" style="width: 220px;">
            <option value="">请选择区/县</option>
        </select>
        <input type="text" style="display: block;" name="details_name" value="{{ details_val|default('') }}">
    </div>

    <script >
        $(function() {

            $('#{{ id | default('area') }}').areaLinkage({
                url:'{{ path('service_area_all') }}',
                province_id:'{{ province_id|default('') }}',
                city_id:'{{ city_id|default('') }}',
                county_id:'{{ county_id|default('') }}'
            });

        })
    </script>
{% endmacro %}

{% macro photos(id) %}
        {% for item in id %}
            layer.photos({
                photos: '{{ item }}'
                ,shift: 5 //0-6的选择，指定弹出图片动画类型，默认随机
            });
        {% endfor %}
{% endmacro %}

{% macro span(value, other) %}
        <div class="controls">
                <span class="help-inline" {{ other | raw }}>{{ value }}</span>
          </div>
{% endmacro %}

{% macro spanSuccess(value, other) %}
    <div class="controls">
        <span class="help-inline" {{ other | raw }} style="color: green">{{ value }}</span>
    </div>
{% endmacro %}


{% macro spanWrning(value, other) %}
    <div class="controls">
        <span class="help-inline" {{ other | raw }} style="color: #ff9900">{{ value }}</span>
    </div>
{% endmacro %}

{% macro spanRefuse(value, other) %}
    <div class="controls">
        <span class="help-inline" {{ other | raw }} style="color: red">{{ value }}</span>
    </div>
{% endmacro %}

{% macro spanOneRow(name, value, other, span_other) %}
        <div class="controls" {{ other }}>
            <span class="help-inline" {{ span_other | raw }}>{{ name }}</span>
            <span class="help-inline" {{ span_other | raw }}>{{ value }}</span>
        </div>
{% endmacro %}

